<script setup lang="ts">
import {useLoginStore} from '../store/useLoginStore.ts'
import router from "@/router";
import {ref} from 'vue'

const loginStatus=useLoginStore()
const activeIndex = ref('1')

const handleSelect = (index: string) => {
  router.push(index)
}

</script>

<template>
    <div class="common-layout">
      <el-container>
        <el-header style="text-align: right; font-size: 12px" >
          <div>
            <font>欢迎用户:{{loginStatus.username}}</font>
          </div>
        </el-header>
      <el-container>
          <el-aside width="150px">
          <el-menu :default-active="activeIndex" @select="handleSelect">
            <el-menu-item index="/merchantExamine">商家审核</el-menu-item>
            <el-menu-item index="/merchantManager">商家管理</el-menu-item>
          </el-menu>
        </el-aside>
      <el-container>
        <el-mian>
        <router-view/>
        </el-mian>
      </el-container>
      </el-container>
      </el-container>
    </div>
</template>

<style scoped>
.el-header {
  background-color: rgba(29, 187, 245, 0.918);
  color: white;
}

.el-aside {
  background-color: rgba(29, 187, 245, 0.918);
  color: white;
  height: 100vh;
}

.el-menu-item.is-active {
  background-color: rgba(29, 187, 245, 0.918);
  color: white;
}
</style>